成品連結：Custom Video Player、程式碼

不知道大家知不知道 KONAMI CODE，當輸入一連串特定內容後會有動畫或是意想不到的小驚喜，或是可以說是彩蛋。有些網站目前還是有內建這個有趣的小彩蛋，去測試一下你最常逛的網站有沒有吧！

那就開始吧!
今天的彩蛋使用的是 Cornify 這個套件，它可以讓你的網頁充斥著彩虹小馬！當使用者輸入正確密語，就會出現彩虹小馬。

設定密語

首先先設定通關密語，當使用者完全依照順序輸入後就會啟動小彩蛋，假設我的密語是「hen 帥」

const secretCode = 'henshuai';

設定監聽事件

接著要監聽使用者輸入的內容，並記錄輸入的內容，這裡使用 key，但也可以使用 keyCode（會是數字）記錄

window.addEventListener('keyup', function(e) {
    // code here
});

比對輸入內容與密語是否一致

有密語了也有輸入內容了，來比對是否一致吧！
首先先建立一個 array 來記錄輸入的內容，也就是當每次輸入時，使用 push() 將內容加入陣列中

let codeArr = [];

window.addEventListener('keyup', function(e) {
    codeArr.push(e.key);
});

但如此一來當輸入內容越來越多時 array 會變得很長，所以要將 codeArr 的長度設定在密語的長度以下

let codeArr = [];
window.addEventListener('keyup', function(e) {
    codeArr.push(e.key);
    if (codeArr.length > secretCode.length) {
      codeArr.shift();  // shift() 會將 array 的第一位移除
    }
});

當使用著真的正確輸入了密語，就會啟動開啟小彩蛋，在 Cornify 中的語法是使用 cornify_add() 來新增彩虹小馬。但這裡我想做點小變化：當正確輸入時會開啟開關，之後無論輸入任何按鍵都可以新增彩虹小馬，因此需要設定一個變數來紀錄是否已啟動

let activated = false;
let codeArr = [];
window.addEventListener('keyup', function(e) {
    codeArr.push(e.key);
    if (codeArr.length > secretCode.length) {
      codeArr.shift();  // shift() 會將 array 的第一位移除
    }
    if (codeArr.join('').includes(secretCode)) {
      activated = true;
    }
    if (activated) {  // 當啟動後按下任何鍵都會增加彩虹小馬
      cornify_add();
    }
});

這裡的比對方式是將 array 轉為 string 後判斷該字串是否包含密語的內容（includes(..) 會 return true 或是 false），如果有就啟動彩蛋

如此一來就完成啦！希望你玩得愉快～